<template>
	<view class="l_pages">
		<jnavbar title="我的抬头"></jnavbar>
		<scroll-view class="page_container tab_page_container" scroll-y>
			<view class="page">
				<u-gap height="1" bg-color="#f6f7f8"></u-gap>
				<u-empty v-if="status == 'none'" text="列表为空请添加抬头" mode="list"></u-empty>
				<u-swipe-action v-else class="content bgf" btn-width="140" :show="item.show" :index="item.id" v-for="(item, index) in list"
				 :key="item.id" :options="options" @click="click" @open="open(index)">
					<view class="item">
						<view class="title-wrap">
							<view>{{item.rise}}</view>
							<view class="tip">税号：{{item.duty_paragraph}} <span v-if="item.is_default==1">默认</span></view>
						</view>
					</view>
				</u-swipe-action>
			</view>
			<u-loadmore v-if="list.length > 9" :status="status" :load-text="loadText" />
		</scroll-view>
		<view class="footer content">
			<view class="footer-text" @click="todetail()">添加抬头</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	import {getisInvoice} from '@/common/invoice.js'
	import http from '@/common/http.js';
	export default {
		data() {
			return {
				list: [],
				page: 1,
				size: 10,
				status: 'loadmore',
				loadText: {
					loadmore: '轻轻上拉',
					loading: '努力加载中',
					nomore: '实在没有了'
				},
				current: 0,
				options: [{
						text: '设为默认',
						style: {
							backgroundColor: '#FC5E25'
						}
					},
					{
						text: '删除',
						style: {
							backgroundColor: '#FF3A2F'
						}
					},
					{
						text: '修改',
						style: {
							backgroundColor: '#409EFF'
						}
					}
				]
			}
		},
		async onLoad(){
			await this.$getWx
			this.getRiseList()
		},
		methods: {
			todetail() {
				this.Jumpurl({
					link: './addinvoice',
					type:1,
					
				})
			},
			open(index) {
				// 先将正在被操作的swipeAction标记为打开状态，否则由于props的特性限制，
				// 原本为'false'，再次设置为'false'会无效
				this.list[index].show = true;
				this.list.map((val, idx) => {
					if (index != idx) this.list[idx].show = false;
				})
			},
			// 获取抬头列表
			getRiseList() {
				let data = {
					size: this.size,
					page: this.page
				}
				let that = this;
				http('/invoice/riseList', data, 'GET').then(res => {
					if (res.data.msg.data.length == 0) {
						this.status = 'none'
					} else {
						const lists = res.data.msg.data
						for (let i of lists) {
							i.show = false
						}
						this.list = lists
					}
				})
			},
			// 删除抬头 or 设置默认抬头
			click(index, index1) {
				// console.log(index,index1)
				let data = {
					id: index
				}
				if (index1 == 1) {
					http('/invoice/' + index, {}, 'DELETE').then(res => {
						this.$u.toast(`删除成功`);
						this.getRiseList();
					})
				} else if (index1 == 0) {
					http('/invoice/setRiseDefault', data, 'POST').then(res => {
						this.$u.toast(`设置成功`);
						this.getRiseList();
					})
				} else {
					this.Jumpurl({
						link: './addinvoice?id=' + index,
						type:1
					});
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		height: calc(100vh - 110rpx);
		font-size: 24rpx;
		background-color: #f6f7f8;
	}

	.content {
		margin: 20rpx;
		border-radius: 10rpx;
		font-size: 28rpx;
		overflow: hidden;
	}

	.bgf {
		background-color: #fff;
	}


	/deep/ .u-btn-text {
		width: 100%;
		box-sizing: border-box;
		padding: 50rpx 20rpx;
		text-align: center;
		font-size: 24rpx;
	}

	.item {
		display: flex;
		padding: 20rpx 25rpx;
	}

	.footer {
		width: 95%;
		line-height: 80rpx;
		text-align: center;
		background: radial-gradient(circle farthest-side at top left, #FE8E0A 0, #FF5011 100%);
		border-radius: 50rpx;
		margin: auto;
		font-size: 28rpx;
		margin-bottom: 20rpx;

		.footer-text {
			font-size: 28rpx;
			color: #fff;
		}
	}

	.title-wrap {
		font-size: 32rpx;

		.tip {
			position: av;
			margin-top: 30rpx;
			font-size: 23rpx;
			color: #999999;
			display: flex;
			align-items: center;
			position: relative;
		}

		span {
			font-size: 20rpx;
			color: #E5582B;
			border: #E5582B solid 1rpx;
			width: 60rpx;
			text-align: center;
			border-radius: 10rpx;
			margin-left: 20rpx;
		}

	}
</style>
